You are on page 1of 10

White Paper

HTTP Streaming for iPhone Best Practices


Table of Contents

Executive Summary. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

Step 1: Planning a Mobile Content Strategy 1

Step 2: Deciding on a Business Model 1

Step 3: Deciding on a Delivery Model 2

Video Streaming For The IPhone. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

Video Support 2

Audio Support 2

Resolution 3

Delivery 3

User Experience 3

iphone os version 3 — New streaming Capabilities. . . . . . . . . . . . . . . . . . . . . . . . . . . 4

Introduction 4

Architecture Overview 4

Best Practices 5

Video Encoding and Bit Rates 5

Stream Segmenter 5

Content Origin 6

Ingest to NetStorage 6

Storage Considerations 6

Client Playback 6

HTML 5 Video Support 6

Detecting iPhone OS Version 7

User Agent for iPhone OS Version 3.0 7


HTTP Streaming for iPhone Best Practices 1

Executive Summary
The consumption of mobile content around the globe is growing rapidly, thanks to
the introduction of more open, Internet based smartphones like the iPhone. These
devices expand the opportunity for content publishers to leverage the public internet
(rather than closed-walled garden approach of carriers) to extend audience reach to
new platforms.

Video capabilities on mobile handsets have increased significantly. According to a re-


cent study, 75% of worldwide data-capable handsets are able to download video clips,
and almost 50% support streaming video. Apple’s iPhone represents a large and grow-
ing share of this market when measured by number of handhelds. But iPhone users are
much more active on the network than others, generating a disproportionate amount
of mobile web and application traffic.

In addition to screen size and ease-of-use, Apple’s integral support of WiFi appears
to be a big contributor to increased mobile internet usage. Apple products represent
almost 80% of worldwide WiFi requests by handhelds, 50% from iPhones and another
30% from the iTouch.

The opportunity for mobile digital media and applications is growing as manufacturers
add WiFi functionality to this leading edge of smartphones. With iPhones out in front,
now is the time for your business to explore and plan a mobile content strategy.

Since the iPhone offers the optimal user video experience at this time, this guide will
focus primarily on delivering content to iPhone users. However we will discuss other
mobile devices in passing.

Step 1: Planning a Mobile Content Strategy


The iPhone has demonstrated that consumers are willing and able to download and
view a wide variety of content and applications on their handsets. Windows of oppor-
tunity range from two to three minute breaks while waiting for something or someone,
to an hour or more while commuting or other travel. Prior to the iPhone access to mo-
bile content was primarily available through ‘on-deck’ services offered by the carriers.
Carriers would determine which brands and content services are available to consum-
ers from their mobile internet home pages. However, there is now a growing shift to
‘off-deck’ or ‘direct-to-consumer’ content through brand owned sites and applications.
This has enabled new business models, revenue streams and delivery options for both
‘on-deck’ and ‘off-deck’ content.

Step 2: Deciding on a Business Model


There are three primary business models in today’s mobile content market, those being;

1 Free content: if the content provides direct support for a product or service, then
you might distribute it for free.

2 Paid for content: another model is to charge a fee directly to the customer for the
content or the application. Variations on this include subscriptions, rental charges
for viewing for a limited time, or an outright purchase.

3 Advertising supported content: supporting content distribution with advertising is


a frequently considered business model. Advertising options include banner ads,
‘pre-roll’ of ads before the main video or more complex integration such as graphics
overlays on the video content.
Choosing the appropriate business model for your content is the first step.
HTTP Streaming for iPhone Best Practices 2

Step 3: Deciding on a Delivery Model


After choosing your business model, the next step is content delivery. ‘On-deck’ deliv-
ery requires partnership with the carrier, but can provide more details on user location,
demographics, subscription, and billing options. ‘Off-deck’ delivers in two ways: using
standard web protocols and browser; or with a custom application that gives you
greater control over quality and user interaction.

A few examples highlight these choices.

Long-playing videos, such as movies or full TV episodes, have typically been down-
loaded to the handset and stored until the user is ready to play them. This involved a
two-step process that goes first to a desktop and then to the handset when docked
(for example, via iTunes). With the availability of WiFi enabled smartphones and faster
wireless 3G data speeds, direct to handset streaming delivery over standard web
protocols is becoming increasingly popular for full TV episodes. In this model, the video
begins to play as soon as enough content has been received.

Short videos and time-sensitive video clips, such as sports or news highlights, are often
delivered by streaming, which means they begin to play as soon as enough content
has been received. These typically have to fit into brief windows of opportunity, with
selection, download, ad display (if any), and main video completed in less than two or
three minutes.

Simulcast of live sports, news and events to mobile handsets requires special consid-
erations around scalability and performance of the delivery mechanism. Prior to the
release of the iPhone 3.0 OS, live streaming required a custom proprietary solution.
iPhone 3.0 OS now has built in support for live video streaming that dynamically adapt
to available bandwidth, optimize full screen video playback and increase battery life.
This paper is intended as a guide to optimizing video streaming to the iPhone 3.0 OS.

Video Streaming for the iPhone


Video support
Full-screen video playback of movie files with the .mov, .mp4, .m4v, and .3gp filename
extensions, using the following compression standards:

• H.264 video, up to 1.5 Mbps, 640 by 480 pixels, 30 frames per second, Low-Com-
plexity version of the H.264 Baseline Profile with AAC-LC audio up to 160 Kbps,
48kHz, stereo audio in .m4v, .mp4, and .mov file formats

• H.264 video, up to 2.5 Mbps, 640 by 480 pixels, 30 frames per second, Baseline Pro-
file up to Level 3.0 with AAC-LC audio up to 160 Kbps, 48kHz, stereo audio in .m4v,
.mp4, and .mov file formats

• MPEG-4 video, up to 2.5 Mbps, 640 by 480 pixels, 30 frames per second, Simple
Profile with AAC-LC audio up to 160 Kbps, 48kHz, stereo audio in .m4v, .mp4, and
.mov file formats

Akamai recommends the use of H.264 encoding in an MP4 container file for iPhone
video content. This combination has excellent compatibility and delivers higher quality
at lower bitrates than MPEG-4.

Audio Support
Audio capabilities available in iPhone OS are designed to provide a rich audio experi-
ence. Audio formats supported: AAC, Protected AAC, MP3, MP3 VBR, Audible
(formats 2, 3, and 4), Apple Lossless, AIFF, and WAV
HTTP Streaming for iPhone Best Practices 3

Resolution
The native video display format of the iPhone is 480 x 320 pixels, or about half the
resolution of standard TV. When viewed sideways the aspect ratio of the screen is 3:2,
which is slightly wider than standard TV, and narrower than widescreen/HDTV.

This means that images in unmodified standard-aspect videos will appear slightly
squashed (shorter and wider). Widescreen videos will either display with black bars
on the top and bottom, or the picture will have the left and right sides clipped

Video content in unmodified standard-aspect videos will appear slightly squashed


(shorter and wider). Widescreen video will either display with black bars on the top and
bottom, or the picture will have the left and right sides clipped.

Widescreen/HDTV 16:9
HDTV 1920x1080
iPhone Screen 3:2

Standard TV 4:3
Standard TV
720x480 iPhone
480x320

Delivery
All media delivery to the iPhone is over HTTP. The iPhone does not natively support
streaming protocols such as RTSP/RTMP, although custom applications can add this
capability. Connectivity is available through EDGE, 3G, and Wi-Fi networks — optimal
encoding takes available bandwidth into account, with 2 to 4 bit-rates that are opti-
mized to different connections.

User Experience
The iPhone OS uses its built-in Media Player application to play media; even when video
is embedded in a webpage. Video automatically expands to the size of the screen and
rotates when the user changes orientation. The controls automatically hide when they
are not in use and appear when the user taps the screen.
HTTP Streaming for iPhone Best Practices 4

iPhone OS Version 3.0 —


New Streaming Capabilities
Introduction
Starting with iPhone OS version 3.0 and QuickTime X, you can send streaming audio
and video over HTTP from an ordinary web server for playback on iPhone, iPod touch,
or other devices, such as desktop computers, without the limitations of Progressive
Downloads.

The new streaming protocol supports Multiple Bitrates and automatically switches to
the optimal bit-rate based on network conditions for a smooth quality playback experi-
ence. This implementation also provides for media encryption and user authentica-
tion over HTTPS, allowing publishers to protect their work. Both Live and On demand
content can be delivered using the 3.0 specification.

Architecture Overview
The encoder (or a separate segmenter process) will produce H.264/AAC content in a
sequence of small content segments, in MPEG-2 TS format (.ts). There is also an M3U8
index file that references the segments; in the case of live content the M3U8 is continu-
ously updated to reflect the latest content.

Content is served to the iPhone over HTTP. This makes Akamai NetStorage an ideal
place to ingest the content, making it available to the Akamai HTTP delivery network.

Delivery Cached or
Live Content

Akamai Akamai HTTP


Net Storage Network

OR

Customer
Web Servers

Wifi

Server

iPhone
Media
Encoder

Wireless Carrier
Stream
Segmenter

Audio/Visual Inputs
HTTP Streaming for iPhone Best Practices 5

Best Practices
Video Encoding and Bit-Rates

User’s accessing content on the iPhone and iPod touch have widely varying download
speeds depending on whether they accessing the content over Edge, 3G or WiFi. These
settings are applicable to both live and on-demand content.

Total Video Audio Audio


Delivery Dimensions Frame Rate Bit Rate Bit Rate Bit Rate Sample Rate

Aspect 4:3
Edge 360x270 1/2 Current 112 85 32 16
3G (Low) 360x270 Current 314 250 64 32
3G (High) 360x270 Current 514 450 64 32
WiFi 360x270 Current 864 800 64 32

Aspect 16:9
Edge 400x224 1/2 Current 112 85 32 16
3G (Low) 400x224 Current 314 250 64 32
3G (High) 400x224 Current 514 450 64 32
WiFi 400x224 Current 864 800 64 32

Note that the bit rates are general suggestions, and should vary depending on target
audience, content subject matter, and specific encoder behavior.

H.264 Encoding should be single-pass Baseline Profile, frame re-ordering disabled.


Key frames are suggested every 5 seconds, ideally an even divisor of the chosen
segment length.

Stream Segmenter

Apple has created the Media Stream Segmenter, a command-line tool that segments
Live MPEG-2 content for delivery, and also creates the associated M3U8 index. The
Segmenter receives an MPEG-2 transport stream over UDP or can read from an existing
file. The index file and media files can then be deployed using common web server
infrastructure. The Media Stream Segmenter can also encrypt the segments using
AES-128 encryption.

This approach should work with many encoders, as MPEG-2 transport stream support
is wide-spread. Some encoder vendors are building this functionality into their product,
so no separate segmentation process is needed.

At minimum the segmenter requires the URL base path, file output path, and
address:port of the encoder. For more options, see the Apple Media Stream Segmenter
user guide. A simple example:

mediastreamsegmenter -b http://myserver.com/mycontent1
-f /mycontent1 224.0.0.1:27000

When configuring the segmenter please take into account best-practices as discussed in
the next section.
HTTP Streaming for iPhone Best Practices 6

Content Origin

As this content is delivered over standard HTTP, it can be served from nearly any origin
web server, including Apache or IIS. The segmenter can be run locally, or configured to
output content to a shared folder on the web server, or you can use a variety of meth-
ods suitable to your OS to move the content.

Akamai also supports serving content from NetStorage, a scalable cost-effective stor-
age solution. NetStorage is transparently replicated across the globe, making it the best
option for managing and delivering high-demand content.

Ingest to NetStorage

Akamai NetStorage is an ideal place to ingest the content, making it available to the
Akamai HTTP delivery network. This section will outline the best practices for ingesting
content to NetStorage. The focus is on Live, where the mechanism is more critical.

NetStorage supports several ways of ingesting content: HTTP POST/ DELETE, File Trans-
fer Protocol (FTP), rsync, Secure Copy (SCP), and SSH File Transfer Protocol (SFTP)

Of these mechanisms HTTP is the preferred protocol for live ingest, as it is a simple
protocol with low overhead, wide support, and compatibility with most firewalls and
network configurations. Akamai is working with encoding partners to enable their
products to directly transfer live content. For On-demand content, customers typically
choose FTP for transferring files to NetStorage.

Storage Considerations

Dealing with many small files can be a challenge for any storage system. Apple and
Akamai both recommend 10 second segments as the best length for balancing perfor-
mance and user experience. Shorter chunk sizes will incur additional transfer overhead
and result in more file entries. It is also recommended that each content item is stored
in its own sub-directory, making performance issues from excessive file entries less
likely. For long-running events consider rolling to a new folder periodically, file entries
should be kept to 2,000 or less per folder.

Client Playback

The iPhone 3.0 Media Player directly supports this segmented streaming approach and
will launch when a user enters the M3U8 link into Safari. Publishers may also choose to
write their own native iPhone apps that are able to seamlessly browse content, leverag-
ing the Media Player for content rendering.

HTML 5 Video Support

HTML 5 is the latest revision of the HTML standard. Of relevance is the new video tag,
which allows video content to be directly embedded into a page, without the need for
proprietary runtimes or plug-ins. HTML 5 is considered in the last stages of the design
process, however, some browsers are beginning to add support for it, starting with
Apple’s Safari 4 browser, which includes Safari on the iPhone 3.0. The next version of
Firefox, 3.5, will also introduce partial support for HTML 5.

The video tag is used in a similar fashion to the image tag, with a source element that
defines the content. A very simple example is as shown:

<video width=”640” height=”480” >


<source src=”content1/content1.m3u8” />
</video>
HTTP Streaming for iPhone Best Practices 7

Like HTML object tags, the video tag has a ‘fall-through’ mechanism. If the video tag is
not recognized, the browser will attempt to render the next child tag. This is extremely
useful, allowing a runtime like Flash to handle playback on browsers that do not yet
support HTML 5 video playback. The video tag can also fall-through across multiple
sources, in the event that a browser does not support a particular file format or com-
pression. The HTML 5 specification defines the syntax for the video tag, but it is up to
the browser which media formats to support.

The below example has a link to the new segmented streaming format for iPhone
3.0, then rolls to a normal on-demand MP4 clip for Safari/iPhone 2.0, and then to an
tag that would load the QuickTime plug-in to play the MP4 clip for other OS/browser
combinations.

...
<html>
<head>
<script type=”text/javascript”>
function isiphone(){
return ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.
match(/iPod/i))) != null;
}
function init(){
if (!isiphone()){
document.getElementById(“videotag”).src = “content.mp4”;
}else{
document.getElementById(“videotag”).src = “content.m3u8”;
}
}
</script>
</head>
<body onload=”init()” >

<video id=”videotag” width=”400” height=”224” controls=”controls” >

<!-- Fall-through to Quicktime object -->


<object width=”400” height=”224” type=”video/quicktime” class=”mov”
data=”content.mp4” >
<param name=”controller” value=”true” />
<!-- Fall-through to Install message -->
<a href=”[link to preferred runtime install..]”>
Click here to install support for this content.
</a>
</object>
</video>

</body>
</html>
...

Note: This example is provided for demonstration purposes, more HTML is needed for
a complete page, values will need to be changed to meet your content, and all target
platforms should be tested.
Detecting iPhone OS Version

If HTML 5 is not used, there is still an easy way to detect if the user can play this new for-
mat. A browser sends a special string, called a ‘user agent’, to websites to identify itself.
The web server, or JavaScript in the downloaded webpage, detects the client’s identity
and can modify its behavior accordingly. Live streaming and Multiple Bit-Rates switching
is available only with iPhone OS 3.0, the site can leverage the User Agent to provide user
friendly messages for unsupported clients, redirect to a different site, or dynamically load
a different type of content. On-Demand content is capable of a better experience with
the segmented streaming approach, while Progressive Download is compatible with all
iPhones and most other systems. If you choose to use this new format for On-Demand
content you may consider also providing the content as Progressive Download to reach
a wider audience.

UserAgent for iPhone OS Version 3.0:

Mozilla/5.0 (iPhone; U; CPU iPhone OS 3_0 like Mac OS X; en-us) AppleWeb-


Kit/528.18 (KHTML, like Gecko) Version/3.1.1 Mobile/XXXXXX Safari/525.20

Note: ‘XXXXXX’ is replaced by the build number, and for iPod Touch requests, iPhone is
replaced by iPod

Getting Your Video Ready For Playback on the iPhone (http://developer.apple.com/mac/articles/quicktime/videocompressionoptimization.html)

H.264 (http://www.apple.com/quicktime/technologies/h264/)

Creating Amazing Video Content with H.264 (http://www.apple.com/quicktime/tutorials/h264.html)

Exporting Movies for iPod and iPhone (http://developer.apple.com/technotes/tn2007/tn2188.html)

Creating Video for Safari (http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/CreatingVideoforSafarioniPhone/Cre-


atingVideoforSafarioniPhone.html#//apple_ref/doc/uid/TP40006514-SW1)

Understanding Safari User Agent String (http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/OptimizingforSafarioni-


Phone/OptimizingforSafarioniPhone.html#//apple_ref/doc/uid/TP40006517-SW3)

The Akamai Difference


Akamai® provides market-leading managed services for powering rich media, dynamic transactions, and enterprise applications online. Hav-
ing pioneered the content delivery market one decade ago, Akamai’s services have been adopted by the world’s most recognized brands
across diverse industries. The alternative to centralized Web infrastructure, Akamai’s global network of tens of thousands of distributed serv-
ers provides the scale, reliability, insight and performance for businesses to succeed online. Akamai has transformed the Internet into a more
viable place to inform, entertain, interact, and collaborate. To experience The Akamai Difference, visit www.akamai.com.

Akamai Technologies, Inc.

U.S. Headquarters International Offices


8 Cambridge Center Unterfoehring, Germany Bangalore, India
Cambridge, MA 02142 Paris, France Sydney, Australia ©2009 Akamai Technologies, Inc. All Rights Reserved. Reproduction in whole or
in part in any form or medium without express written permission is prohibited.
Tel 617.444.3000 Milan, Italy Beijing, China
Akamai and the Akamai wave logo are registered trademarks. Other trademarks
Fax 617.444.3001 London, England Tokyo, Japan contained herein are the property of their respective owners. Akamai believes that the
U.S. toll-free 877.4AKAMAI Madrid, Spain Seoul, Korea information in this publication is accurate as of its publication date; such information
(877.425.2624) Stockholm, Sweden Singapore is subject to change without notice.

www.akamai.com

You might also like